<template>
  <view class="fu-pop" v-if='isShow'>
    <!-- 页数 -->
    <view v-if="type == 1" class="page">
      <text>{{ currentPage }}</text>
      <view class="cut-line"></view>
      <text>{{ pageNum }}</text>
    </view>
    <!-- 返回顶部 -->
    <view v-if="type == 2"  class="text-center"  @click="backUp">
      <text class="fu-iconfont back-up" >&#xe652;</text>
    </view>
  </view>
</template>

<script>
  export default {
    name: 'fu-floor',
    props: {
      currentPage: {
        type: Number,
        default: 0
      },
      pageNum: {
        type: Number,
        default: 0
      },
      type:{
        type:Number,
        default:1
      },
      isShow:{
        type:Boolean,
        default:false
      }
    },
    data() {
      return {
        // type: 1,  // 根据type不同显示回到顶部or页面数
        // flag: false,
      }
    },
    methods: {
      // 返回顶部效果
      backUp() {
        console.log('返回顶部')
        uni.pageScrollTo({
          scrollTop: 0,
          duration: 100,
        });
      },
    },
  }
</script>

<style lang='scss' scoped>
  .fu-pop {
    position: fixed;
    bottom: 150rpx; // 距离底部
    right: 30rpx; // 距离右边
    z-index: 999;
    width: 80rpx; // 宽
    height: 80rpx; // 高
    background-color: #FFFFFF;
    border: 4rpx solid #dadada;
    border-radius: 50%;

    .back-up {
      line-height: 80rpx;
      font-size: 40rpx;
    }

    .page {
      display: flex;
      flex-direction: column;
      align-items: center;

      .cut-line {
        height: 4rpx;
        width: 60rpx;
        background: #dadada;
      }
    }
  }
</style>